<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	<script type="text/javascript">
		
		window.onload = function(){
			var huakuai = document.getElementById("huakuai");
//			给滑块加鼠标移动事件
			huakuai.onmousemove = function(){
//				获得滑块的值,写入到title中
				document.title = huakuai.value;
			}
			
			
//			给颜色面板绑定onchange事件
			document.getElementById("yanse").onchange = function(){
				alert(this.value);
			}
		}
		
	</script>
	</head>
	<body>
		
		<form action="hd.php">
			
			用户名：<input type="text" />
			<br /><br />
			密码：<input type="password" />
			<br /><br />
			邮箱：<input type="email" />
			<br /><br />
			网址：<input type="url" />
			<br /><br />
			<input type="number" min="1" max="20" step="3" value="1" />
			<br /><br />
			<input type="range" min="0" max="20" step="2" value="4" id="huakuai" />
			<br /><br />
			<input type="date" />
			<br /><br />
			
			<!--语义化的标签-->
			<input type="search" />
			<br /><br />
			<input type="color" id="yanse" />
			<br /><br />
			
			<input type="submit" />
			
			
		</form>
		
		
		
	</body>
</html>
